.d_f {
    display: flex;
    /* 弹性盒模型 */
}

.f_s_12 {
    font-size: 12px;
    /* 字体大小为12px */
}

.f_s_14 {
    font-size: 14px;
    /* 字体大小为14px */
}

.f_s_16 {
    font-size: 16px;
    /* 字体大小为16px */
}

.f_w {
    font-weight: 700;
    /*字体 加粗 */
}

.f_c_ho {
    color: #f00;
    /* 红色 */
}

.f_c_hu {
    color: #ccc;
    /* 灰色 */
}

.f_c_b {
    color: #ffffff;
    /* 白色 */
}
.c_999 {
    color: #999999;
    /* 白色 */
}
.f_c_he {
    color: #000;
    /* 黑色 */
}

.f_c_3 {
    color: #333;
}

.f_c_6 {
    color: #666;
}

.f_c_9 {
    color: #999;
}

.t_a_l {
    text-align: left;
    /* 文本左对齐 */
}

.t_a_c {
    text-align: center;
    /* 文本居中 */
}

.t_a_r {
    text-align: right;
    /* 文本右对齐 */
}

.t_d_u {
    text-decoration: underline;
    /* 装饰在文本底部 */
}

.t_d_o {
    text-decoration: overline;
    /* 装饰在顶部 */
}

.t_d_l_t {
    text-decoration: line-through;
    /* 装饰在文本中间 */
}

.d_i {
    display: inline;
    /* 块级元素装换成行内元素 */
}

.d_i_b {
    display: inline-block;
    /* 块级元素装换成行内块元素 */
}

.d_b {
    display: block;
    /* 行内和行内块元素装换成块级元素 */
}

.d_n {
    display: none;
    /* 隐藏元素 */
}

.p_r {
    position: relative;
    /* 相对定位 */
}

.p_a {
    position: absolute;
    /* 绝对定位 */
}

.p_f {
    position: fixed;
    /* 固定定位 */
}

.b_r_50 {
    border-radius: 50%;
    /* 圆角为50% */
}

.j_c_s_a {
    justify-content: space-around;
    /* 两边的子元素距离父元素的两边有间距，然后中间距离自动等分 */
}

.j_c_s_b {
    justify-content: space-between;
    /* 两边的子元素距离父元素没有间距，然后中间距离自动等分 */
}

.j_c_c {
    justify-content: center;
    /* 所有的子元素相当于父元素水平居中 */
}

.a_i_c{
   align-items: center;
    /* （竖轴排列方式）子元素相当于父元素垂直方向居中 */
}

.f_d_c {
    flex-direction: column;
    /* 弹性盒模型的竖项排列方式 */
}

* {
    margin: 0;
    padding: 0;
    /* 清除游览器的痕迹 */
}

.conter {
    display: flex;
    justify-content: center;
    /* 弹性盒模型，所有的文本在页面的中间 */
}

.warp {
    width: 1280px;
    /* 宽度为1280px，基本上不会超过1400px */
}

.o-h {
    overflow: hidden;
    /* 超出部分隐藏 */
}

.w_o_t {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    /* 超出部分隐藏（只限字体） */
}

.d_n {
    display: none;
    /* 不占位置 */
}

.v_h {
    visibility: hidden;
    /* 占位置 */
}

.f_w_w {
    flex-wrap: wrap;
    /* 换行 */
}

.w_s_n {
    white-space: nowrap;
    /* 内容不换行 */
}

.m_t_20 {
    margin-top: 20px;
    /* 向下20 */
}

.m_l_20 {
    margin-left: 20px;
}

.m_t_10 {
    margin-top: 10px;
}

.m_l_10 {
    margin-left: 10px;
}

.b_c_hong {
    background-color: red;
}

.b_c_hei {
    background-color: black;
}

.b_c_bai {
    background-color: #ffffff;
}

.b_1_s_bai {
    border: 1px solid #ffffff;
}

.b_1_d_bai {
    border: 1px dashed #ffffff;
}

.b_l_n {
    border-left: none;
    /* 左边框隐藏 */
}

.b_t_n {
    border-top: none;
}

.b_r_n {
    border-right: none;
}

.b_b_n {
    border-bottom: none;
}

.m_t_15 {
    margin-top: 15px;
}

.m_t_30 {
    margin-top: 30px;
}

.m_t_35 {
    margin-top: 35px;
}

.m_t_40 {
    margin-top: 40px;
}
.m_t_11 {
    margin-top: 11px;
}
.m_t_12 {
    margin-top: 12px;
}
.m_t_13 {
    margin-top: 13px;
}
.m_t_14 {
    margin-top: 14px;
}

.m_l_35 {
    margin-left: 35px;
}

.m_t_40 {
    margin-left: 40px;
}

.m_t_5 {
    margin-top: 5px;
}

.b_none {
    border: none;
}

.f_s_18 {
    font-size: 18px;
}
.m_l_40 {
    margin-left: 40px;
}

.o_n {
    outline: none;
    /* 隐藏边框 */
}

.b_s {
    box-shadow: 0px 0px 5px #ccc;
}

.p_l_10 {
    padding-left: 10px;
}

.p_l_5 {
    padding-left: 5px;
}

.p_l_15 {
    padding-left: 15px;
}

.p_l_20 {
    padding-left: 20px;
}

.p_l_25 {
    padding-left: 25px;
}

.p_l_30 {
    padding-left: 30px;
}

.p_l_35 {
    padding-left: 35px;
}

.p_l_40 {
    padding-left: 40px;
}

.p_t_10 {
    padding-top: 10px;
}

.p_t_5 {
    padding-top: 5px;
}

.p_t_15 {
    padding-top: 15px;
}

.p_t_20 {
    padding-top: 20px;
}

.p_t_25 {
    padding-top: 25px;
}

.p_t_30 {
    padding-top: 30px;
}

.p_t_35 {
    padding-top: 35px;
}

.p_t_40 {
    padding-top: 40px;
}

.w_100 {
    width: 100%;
}

.m_l_5 {
    margin-left: 5px;
}

.z_i {
    z-index: 999;
}

.m_t_3 {
    margin-top: 3px;
}

.c_p {
    cursor: pointer;
}

.c_0_65 {
    color: rgba(0, 0, 0, 0.65) !important;
}

.c_0_85 {
    color: rgba(0, 0, 0, 0.85);
}

.c_666 {
    color: #666666;
}

.c_333 {
    color: #333333;
}

.m_l_1 {
    margin-left: 1px;
}
.m_l_15 {
    margin-left: 15px;
}
.m_l_2 {
    margin-left: 2px;
}

.m_l_3 {
    margin-left: 3px;
}

.m_l_4 {
    margin-left: 4px;
}

.m_t_1 {
    margin-top: 1px;
}

.m_t_2 {
    margin-top: 2px;
}

.m_t_3 {
    margin-top: 3px;
}

.m_t_4 {
    margin-top: 4px;
}

.m_l_30 {
    margin-left: 30px;
}

.f_r {
    float: right;
}

.f_l {
    float: left;
}

/*css主要部分的样式*/
/*定义滚动条宽高及背景，宽高分别对应横竖滚动条的尺寸*/
::-webkit-scrollbar {
    width: 8px; /*对垂直流动条有效*/
    height: 8px; /*对水平流动条有效*/
}

/*定义滑块颜色、内阴影及圆角*/
::-webkit-scrollbar-thumb{
border-radius: 4px;
background-color: #ccc;
}
    
.p_r_20{
    padding-right: 20px;
}
.p_r_10{
    padding-right: 10px;
}
.h_100{
    height: 100%;
}
.c_000{
    color: #000;
}
.f_w_b{
    font-weight: bold;
}
.table{
    height: calc(100% - 20px)!important;
}
// @media screen and (min-width:900px){
// .a{
//   width: 500px;
//   height: 500px;
//   background: red;
// }
// }
// @media screen and (max-width:1366px){
// .a{
//   width: 500vw;
//   height: 500px;
//   background: green;
// }
// }
